<template>
<div>
	<!--头部-->
	<div class="pin-top">
		<a href="#/"><img class="pin-jian" src="../assets/img/duanhuowang/zuo.png" alt=""/></a>
		<p class="pinpin">品牌精选</p>
		<a><img class="pin-fan" src="../assets/img/duanhuowang/fan.png" alt=""/></a>
	</div>	
	<!--第一个-->
	<!--大图-->
	<img class="haba" src="../assets/img/shouye/pinpai/pingpai1.png" alt=""/>
	<!--1-->
	<div class="ha-danqu1">
		<img class="ha-kitty" src="../assets/img/shouye/pinpai/pinpai2.png" alt=""/>
		<p class="ha-kzi">HABA White Lady雪白...</p>
		<p class="ha-bmongy">￥266.88</p>
	</div>
	<!--2-->
	<div class="ha-danqu ha-danqu1">
		<img class="ha-kitty" src="../assets/img/shouye/pinpai/pinpai2.png" alt=""/>
		<p class="ha-kzi">HABA White Lady雪白...</p>
		<p class="ha-bmongy">￥266.88</p>
	</div>
	<!--3-->
	<div class="ha-danqu ha-danqu1">
		<img class="ha-kitty" src="../assets/img/shouye/pinpai/HABA.png" alt=""/>
		<p class="ha-kzi">HABA G露润泽柔肤水...</p>
		<p class="ha-bmongy">￥166.16</p>
	</div>
	<!--第二个-->
	<div v-for="dd in 5">
	<!--大图-->
	<img class="for" src="../assets/img/shouye/pinpai/pingpai1.png" alt=""/>
	<!--1-->
	<div class="ha-danqu1">
		<img class="ha-kitty" src="../assets/img/shouye/pinpai/pinpai2.png" alt=""/>
		<p class="ha-kzi">HABA White Lady雪白...</p>
		<p class="ha-bmongy">￥266.88</p>
	</div>
	<!--2-->
	<div class="ha-danqu ha-danqu1">
		<img class="ha-kitty" src="../assets/img/shouye/pinpai/pinpai2.png" alt=""/>
		<p class="ha-kzi">HABA White Lady雪白...</p>
		<p class="ha-bmongy">￥266.88</p>
	</div>
	<!--3-->
	<div class="ha-danqu ha-danqu1">
		<img class="ha-kitty" src="../assets/img/shouye/pinpai/HABA.png" alt=""/>
		<p class="ha-kzi">HABA G露润泽柔肤水...</p>
		<p class="ha-bmongy">￥166.16</p>
	</div>
  </div>
	<!---->
</div>
</template>

<script>
</script>

<style>
	/*头部*/
	.pin-top {
		position: fixed;
		top: 0;
		left: 0;
		background: #e53e42;
		width: 100%;
		height: 9.6rem;
		display: flex;
		justify-content: space-around;
		align-items: center;
		z-index:100;
	}
	
	.pinpin {
		color: white;
		font-size: 3.6rem;
		text-align: center;
		padding: 0 20rem;
		font-weight: 200;
	}
	
	.pin-jian {
		width: 2.3rem;
		height: 3.8rem;
	}
	
	.pin-fan {
		width: 3.6rem;
		height: 3.4rem;
	}
	/*HABA*/
	.haba{
		width: 100%;
		height: 30rem;
		margin-top: 9.6rem;
		margin-bottom: 1rem;
	}
	.for{
		width: 100%;
		height: 30rem;
		margin-top:2rem;
		margin-bottom: 1rem;
	}
	/*雪白，柔肤水*/
	.ha-danqu1{
		width:22.4rem;
		background: #FFFFFF;
		margin-left: 1.5rem;
		text-align: center;
		float:left;
	}
	.ha-danqu{
		margin-left: 1rem;
	}
	.ha-kitty{
		width: 22.4rem;
		height: 22.6rem;
	}
	.ha-kzi{
		font-size: 1.8rem;
		color:#4d4d4d;
		padding:1rem 0;
	}
	.ha-bmongy{
		font-size: 2rem;
		color:red;
		text-align: left;
		padding-bottom: 1rem;
		padding-left: 1rem;
	}
</style>